<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>后台回复管理-模块管理员</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="icon" th:href="@{/读书1.jpg}" type="image/jpg" >
    <link rel="stylesheet" href="../static/layui-v2.5.7/layui/css/layui.css" th:href="@{/layui-v2.5.7/layui/css/layui.css}">
    <!--  -->
    <script src="http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
    <script src="../static/layui-v2.5.7/layui/layui.js" th:src="@{/layui-v2.5.7/layui/layui.js}"></script>
    <!--  -->

</head>

<style>
    .div1_div1 {
        margin: 20px 0px 0px 20px;
        //min-width: 1450px;
    }

    #title_span {
        font-weight: 700;
        font-size: 14px;
    }

    #msg_span {
        font-family: '楷体';
        font-size: 16px;
    }

    #msg_img {
        width: 100px;
        height: 100px;
        /* border: 1px solid red; */
        border-radius: 50px;
    }

    .div1_div1_status_choiceTitle{
        font-family: '楷体';
        font-weight: 700;
        font-size: 12px;
        padding: 5px 10px 5px 10px;
        border-radius: 3px;
    }

    .div1_div1_button{
        padding: 0px 10px;
        float: right;
        margin: 5px 35px 0px 0px;
    }
</style>

<body class="layui-layout-body">

<div class="layui-layout layui-layout-admin">
    <div class="layui-header">
        <div class="layui-logo">后台管理系统</div>
        <!-- 头部区域（可配合layui已有的水平导航） -->
        <ul class="layui-nav layui-layout-left">
            <li class="layui-nav-item">
                <i class="layui-icon layui-icon-circle-dot"></i>
                版块管理员管理 / 回复管理
            </li>
        </ul>

        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item">
                <a href="javascript:;">
                    <img th:src="${session.adminUser.headImg}" class="layui-nav-img">
                    <span th:text="${session.adminUser.username}"></span>
                </a>
            </li>

            <li class="layui-nav-item">
                <a th:href="@{/outAdminLogin(id = ${session.adminUser.id})}">
                    <i class="layui-icon layui-icon-logout" style=""></i>
                    退了
                </a>
            </li>
        </ul>
    </div>

    <div class="layui-side layui-bg-black">
        <div class="layui-side-scroll">

            <!-- 根据管理员类型判断） -->
            <ul class="layui-nav layui-nav-tree" lay-filter="test" th:if="${session.adminUser.userStatus} eq 4">
                <li class="layui-nav-item">
                    <a th:href="@{/managementIndexByType/10}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        Java模块系统首页
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/blogManagementByType/10}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        Java模块博客管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/toCommentManagementByType/10}">
                        <i class="layui-icon layui-icon-chat" style=""></i>
                        Java模块评论管理
                    </a>
                </li>
                <li class="layui-nav-item layui-this">
                    <a th:href="@{/toReplyManagementByType/10}">
                        <i class="layui-icon layui-icon-reply-fill" style=""></i>
                        Java模块回复管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/userRightsManagementByType/10}">
                        <i class="layui-icon layui-icon-util" style=""></i>
                        Java模块权限管理
                    </a>
                </li>
            </ul>

            <ul class="layui-nav layui-nav-tree" lay-filter="test" th:if="${session.adminUser.userStatus} eq 5">
                <li class="layui-nav-item">
                    <a th:href="@{/managementIndexByType/11}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        C++模块系统首页
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/blogManagementByType/11}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        C++模块博客管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/toCommentManagementByType/11}">
                        <i class="layui-icon layui-icon-chat" style=""></i>
                        C++模块评论管理
                    </a>
                </li>
                <li class="layui-nav-item layui-this">
                    <a th:href="@{/toReplyManagementByType/11}">
                        <i class="layui-icon layui-icon-reply-fill" style=""></i>
                        C++模块回复管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/userRightsManagementByType/11}">
                        <i class="layui-icon layui-icon-util" style=""></i>
                        C++模块权限管理
                    </a>
                </li>
            </ul>

            <ul class="layui-nav layui-nav-tree" lay-filter="test" th:if="${session.adminUser.userStatus} eq 6">
                <li class="layui-nav-item">
                    <a th:href="@{/managementIndexByType/12}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        Python模块系统首页
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/blogManagementByType/12}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        Python模块博客管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/toCommentManagementByType/12}">
                        <i class="layui-icon layui-icon-chat" style=""></i>
                        Python模块评论管理
                    </a>
                </li>
                <li class="layui-nav-item layui-this">
                    <a th:href="@{/toReplyManagementByType/12}">
                        <i class="layui-icon layui-icon-reply-fill" style=""></i>
                        Python模块回复管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/userRightsManagementByType/12}">
                        <i class="layui-icon layui-icon-util" style=""></i>
                        Python模块权限管理
                    </a>
                </li>
            </ul>

            <ul class="layui-nav layui-nav-tree" lay-filter="test" th:if="${session.adminUser.userStatus} eq 7">
                <li class="layui-nav-item">
                    <a th:href="@{/managementIndexByType/13}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        Js模块系统首页
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/blogManagementByType/13}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        JS模块博客管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/toCommentManagementByType/13}">
                        <i class="layui-icon layui-icon-chat" style=""></i>
                        JS模块评论管理
                    </a>
                </li>
                <li class="layui-nav-item layui-this">
                    <a th:href="@{/toReplyManagementByType/13}">
                        <i class="layui-icon layui-icon-reply-fill" style=""></i>
                        JS模块回复管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/userRightsManagementByType/13}">
                        <i class="layui-icon layui-icon-util" style=""></i>
                        JS模块权限管理
                    </a>
                </li>
            </ul>

            <ul class="layui-nav layui-nav-tree" lay-filter="test" th:if="${session.adminUser.userStatus} eq 8">
                <li class="layui-nav-item">
                    <a th:href="@{/managementIndexByType/14}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        c语言模块系统首页
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/blogManagementByType/14}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        c语言模块博客管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/toCommentManagementByType/14}">
                        <i class="layui-icon layui-icon-chat" style=""></i>
                        c语言模块评论管理管理
                    </a>
                </li>
                <li class="layui-nav-item layui-this">
                    <a th:href="@{/toReplyManagementByType/14}">
                        <i class="layui-icon layui-icon-reply-fill" style=""></i>
                        c语言模块回复管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/userRightsManagementByType/14}">
                        <i class="layui-icon layui-icon-util" style=""></i>
                        c语言模块权限管理
                    </a>
                </li>
            </ul>

            <ul class="layui-nav layui-nav-tree" lay-filter="test" th:if="${session.adminUser.userStatus} eq 9">
                <li class="layui-nav-item">
                    <a th:href="@{/managementIndexByType/15}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        云计算模块系统首页
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/blogManagementByType/15}">
                        <i class="layui-icon layui-icon-read" style=""></i>
                        云计算模块博客管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/toCommentManagementByType/15}">
                        <i class="layui-icon layui-icon-chat" style=""></i>
                        云计算模块评论管理
                    </a>
                </li>
                <li class="layui-nav-item layui-this">
                    <a th:href="@{/toReplyManagementByType/15}">
                        <i class="layui-icon layui-icon-reply-fill" style=""></i>
                        云计算模块回复管理
                    </a>
                </li>
                <li class="layui-nav-item">
                    <a th:href="@{/userRightsManagementByType/15}">
                        <i class="layui-icon layui-icon-util" style=""></i>
                        云计算模块权限管理
                    </a>
                </li>
            </ul>

        </div>
    </div>

    <div class="layui-body">
        <!-- 内容主体区域 -->
        <table class="layui-hide" id="test" lay-filter="test"></table>
    </div>

    <div class="layui-footer">
        <!-- 底部固定区域 -->
        Copyright © 2017-2021  社区SQ.com 版权所有
    </div>
</div>

<!-- 弹出查看信息 -->
<div id="userDetail" style="display: none;">
    <div class="div1_div1">
        <span id="title_span">回复人：</span><span class="div1_div1_name" id="msg_span">张宇</span>
        <br>
        <br>
        <span id="title_span">回复的评论：</span><span class="div1_div1_title" id="msg_span">java泛型</span>
        <br>
        <br>
        <span id="title_span">回复内容：</span><span class="div1_div1_content" id="msg_span">水水水水</span>
        <br>
        <br>
        <span id="title_span">回复时间：</span><span class="div1_div1_createTime" id="msg_span">2020-10-10 02:11:33</span>
    </div>
</div>

<!-- 弹出修改页面 -->
<div id="userDetailTwo" style="display: none;">
    <div class="div1_div1">
        <span id="title_span">用户姓名：</span><span class="div1_div1_name" id="msg_span">张宇</span>
        <br>
        <br>
        <span id="title_span">电子邮箱：</span><span class="div1_div1_email" id="msg_span">18113503442</span>
        <br>
        <br>
        <span id="title_span">头像：</span>
        <img src="" alt="" id="msg_img" class="div1_div1_headImg">
        <br>
        <br>
        <span id="title_span">状态：</span><span class="div1_div1_statusSpan" id="msg_span">管理员</span>
        <span class="div1_div1_status_choiceTitle">修改状态:</span>
        <select id="statusSelect">
            <option>普通用户</option>
            <option>管理员</option>
            <option>超级管理员</option>
            <option>Java模块管理员</option>
            <option>C++模块管理员</option>
            <option>Python模块管理员</option>
            <option>JavaScript模块管理员</option>
            <option>c语言模块管理员</option>
            <option>云计算模块管理员</option>
            <option>禁用</option>
        </select>
        <br>
        <br>
        <button type="button" class="div1_div1_button">确定</button>
    </div>
</div>

<script type="text/html" id="barTop">
    <i class='layui-icon layui-icon-delete' style="font-size: 30px;margin-right:10px;" lay-event="delList"></i>
</script>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class='layui-icon layui-icon-delete'></i>删除</a>
    <a class="layui-btn layui-btn-warm layui-btn-xs" lay-event="detail"><i class='layui-icon layui-icon-read'></i>查看</a>
</script>

<script th:inline="javascript">

    layui.use('element', function () {
        var element = layui.element;
    });

    var type = [[${type}]];

    layui.use('table', function () {
        var table = layui.table;
        table.render({
            elem: '#test',
            url: '/ImagineCommunity/replyManagementByType/'+type,
            cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            method:'POST',
            page:true,
            limit:10,//每页数量，控制每页高度
            height:'full-125',//控制页码高度
            defaultToolbar: [], //这里在右边显示
            toolbar: '#barTop',//指向自定义工具栏模板选择器
            done: function (res, curr, count) {
                //判断本页数据是否为空，空则跳到前一页
                if (curr > 1 && res.data.length === 0) {
                    curr --;
                    //执行重载
                    table.reload('test', {
                        page: {
                            curr: curr //重新从减少一 页开始
                        },
                    });
                }
            },
            cols: [ [
                  { type: 'checkbox' }
                , { field: 'id', width: 150, title: 'ID', sort: true }
                , { field: 'userName', width: 150, title: '回复人' }
                , { field: 'commentContent', width: 200, title: '回复的评论' }
                , { field: 'content', width: 300, title:'回复内容'}
                , { field: 'createTime', width: 250, title: '回复时间' }
                , { field: 'score', title: '操作', toolbar: '#barDemo',width: '13%' }
            ] ]
        });

        //监听行工具事件
        table.on('tool(test)', function (obj) {
            var data = obj.data;
            if (obj.event === 'del') {  //删除用户信息
                layer.confirm('确定要删除用户【' + obj.data.userName + '】的回复么', function (index) {
                    var id = obj.data.id;
                    $.ajax({
                        url:'/ImagineCommunity/deleteReply',
                        data:{id:id},
                        success:function (res) {
                            layer.msg("删除成功!");
                            setTimeout(function() {
                                table.reload("test");
                            }, 1000);
                        }
                    })
                });
            } else if (obj.event === 'edit') {//修改用户信息
                $('.div1_div1_name').html(obj.data.username);
                $('.div1_div1_email').html(obj.data.email);
                $('.div1_div1_headImg').attr('src',obj.data.headImg);
                $('.div1_div1_statusSpan').html(obj.data.value);
                layui.use('layer', function () {
                    layer.open({
                        type: 1,//1是当前页面内容，2是路径内容
                        area: ["400px", "350px"],
                        content: $("#userDetailTwo").html(), //当前$("#popSearchRoleTest").html()，其他页面test2.html
                        title: "修改用户",
                    })

                    $('.div1_div1_button').click(function() {
                        var id = obj.data.id;
                        var status = $(".layui-layer-content #statusSelect").val();
                        $.ajax({
                            url:'/ImagineCommunity/updateAdminUser',
                            data:{id:id,
                                  userStatus:status,
                            },
                            type:'post',
                            success:function (res) {
                                layer.msg("修改成功!");
                                setTimeout(function() {
                                    layer.closeAll();
                                    table.reload("test");
                                }, 1000);
                            }
                        })
                    })
                })
            }else if (obj.event === 'detail') { //查看信息
                $('.div1_div1_name').html(obj.data.userName);
                $('.div1_div1_title').html(obj.data.commentContent);
                $('.div1_div1_content').html(obj.data.content);
                $('.div1_div1_createTime').html(obj.data.createTime);
                layui.use('layer', function () {
                    layer.open({
                       type: 1,//1是当前页面内容，2是路径内容
                       area: ["400px", "350px"],
                       content: $("#userDetail").html(), //当前$("#popSearchRoleTest").html()，其他页面test2.html
                       title: "板块回复信息",
                    })
                })
            }
        });

        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'delList':
                    layer.confirm('确定要删除这些文章么', function (index) {
                        var data = checkStatus.data;
                        var idList = "";
                        //循环取得遍历
                        for(var i=0;i<data.length;i++){
                               idList = idList + "," + data[i].id ;
                        }
                        //console.log(idList);
                        $.ajax({
                            url:'/ImagineCommunity/deleteReplyList',
                            type:"POST",  //提交方式
                            data:{idList},//数据
                            success:function(res){
                                layer.msg('删除成功!');//弹出信息 //layer.close(layer.index);//关闭弹窗
                                setTimeout(function(){//延迟1秒再跳转
                                    layer.closeAll();
                                    table.reload("test");
                                }, 1000);
                            }
                        })
                    })
                break;
            };
        });
    });

    <!-- 浏览器关闭事件,浏览器关闭时向后台发送退出链接,thymeleaf内联对象后加个'?',不然不存在时会报错-->
    $(window).unload(function(){
        $.ajax({
            url : "/ImagineCommunity/outAdminLogin?id=[[${session.adminUser.id}]]",
        })
    });

</script>
</body>

<style type="text/css">

    .layui-table-cell{
        text-align:center;
        white-space: normal;
        height:auto;
    }

    .layui-table img{
        max-width:55px;
    }

</style>

</html>